<template>
  <el-form
    :model="oParams"
    :rules="rules"
    ref="em_form"
    label-width="252px"
    content-width="480px"
  >
    <!-- 图片附件 & 抓图时间间隔 -->
    <div v-if="oCapbilities.bSptSnapShoot">
      <el-form-item :label="$t('attachedImage')">
        <el-switch v-model="oParams.bEnablePic"></el-switch>
      </el-form-item>
      <el-form-item :label="$t('captureInterval')" v-show="oParams.bEnablePic">
        <el-select v-model="oParams.szPicInterval" class="el-input--width">
          <el-option v-for="(item) in oCapbilities.aEmailOptions" :key="item" :value="item" :label="item + $t('seconds')"></el-option>
        </el-select>
      </el-form-item>
      <!-- 后智能周界抓图 -->
      <el-form-item v-if="oCapbilities.bSupportInteliCaptureEnabled && oParams.bEnablePic" :label="$t('inteliCaptures')">
        <el-switch v-model="oParams.inteliCaptureEnabled"></el-switch>
      </el-form-item>
    </div>
  </el-form>
</template>

<script>
import WebSDK from '@/Common/service/request/websdk';
import { isEmail, nodeValue, checkAddressingType, parseXmlFromStr } from '@/Common/utils/utils.js';
import Response from '@/Common/service/response.js';
import Device, { testNet } from '@/Common/service/device.js';
import { validateNull, validateNoMoreLength, validatePassNameUp, validateRange } from '@/Common/utils/pc/validate.js';
import Common from '@/Common/service/common.js';
export default {
  name: 'HelloWorld',
  props: {
    msg: String
  },
  data() {
    let that = this;
    let validatePass = (rule, value, callback) => {
      that.$refs['em_form'].validateField('cofirmPassword');
      callback();
    };
    let validatePass2 = (rule, value, callback) => {
      if (value !== that.oParams.oPassword) {
        callback(new Error(that.$t('passNotMatch')));
      } else {
        callback();
      }
    };
    let validateSecSmtpPass = (rule, value, callback) => {
      that.$refs['em_form'].validateField('SecSmtpcofirmPassword');
      callback();
    };
    let validateSecSmtpPass2 = (rule, value, callback) => {
      if (value !== that.oParams.oSecSmtpPassword) {
        callback(new Error(that.$t('passNotMatch')));
      } else {
        callback();
      }
    };
    let validtor = (rule, value, callback)=>{
      if (value !== "" && !isEmail(value)) {
        callback(new Error(`${that.$t('wrong') } ${ that.$t('senderAddress')}`));
      } else {
        callback();
      }
    };
    let receiverAddrValidtor = (rule, value, callback)=>{
      if (value !== "" && !isEmail(value)) {
        callback(new Error(`${that.$t('wrong') } ${ that.$t('receiverAddress')}`));
      } else {
        callback();
      }
    };
    return {
      oCapbilities: {
        bSupportModify: Device.m_oDeviceCapa.iCmEmailType === 3,
        bSptSnapShoot: true,
        aEmailOptions: [],
        bSupportSSLTLS: true,
        bSupportEmailEncryption: false,
        bSupportSecondarySMTP: false, //支持备用smtp
        aEncryptionType: [], // 邮件加密类型
        bSupportSmartTLS: false, // 是否支持STARTTLS
        iReceiverMaxNum: 3 // 可设置的收件人的最大个数
      },
      oParams: {
        message: {
          age: {
            required: true,
          }
        },
        szSenderAddress: "",
        szSmtpServer: "",
        szSmtpPort: "",
        bEnableSSL: false,
        bEnablePic: Device.m_oDeviceCapa.bSupportEmailEncrypt,
        szPicInterval: "",
        bAuthentication: "",
        szUserName: "",
        oPassword: Common.m_szDefaultPwd,
        cofirmPassword: Common.m_szDefaultPwd,
        szPasswordDefault: Common.m_szDefaultPwd,
        inteliCaptureEnabled: false,
        benabledSecSmtp: false,
        bSecSmtpAuthentication: false,
        szSecSmtpServer: "",
        szSecSmtpPort: "",
        bSecSmtpEnableSSL: false,
        szEncryptionType: "",
        szEncryptionTypeCache: "", //缓存加密类型，选择不加密模式确认时需要用到
        bEnableSTARTTLS: false,
        szSecSmtpUserName: "",
        oSecSmtpPassword: Common.m_szDefaultPwd,
        SecSmtpcofirmPassword: Common.m_szDefaultPwd,
        szSecSmtpPortDef: 25,
        bShowReceiverDlg: false, //收件人编辑弹框
        szReceiverEditMode: "add" //收件人编辑模式：添加或修改
      },
      receiverList: [],
      selectedReceiver: [],
      oReceiverDlgParams: { //收件人弹框参数
        iId: 1,
        szReceiverName: "",
        szReceiverAddress: ""
      },
      isSupportEmailTest: Device.m_oDeviceCapa.isSupportEmailTest,
      emailCmd: Device.m_oDeviceCapa.bSupportEmailEncrypt ? "emailEncrypt" : "email",
      emailTestCmd: Device.m_oDeviceCapa.bSupportEmailEncrypt ? "testEmailEncrypt" : "testEmail",
      disableTestEmail: true // 是否禁用邮箱测试
    }
  },
  computed: {
    oParamsT() {
      return {
        age: 999
      }
    },
  },
  methods: {
    // 主SMTP端口默认值
    enableSSLchange(e) {
      this.oParams.szSmtpPort = e ? "587" : "25";
    },
    // 备用SMTP端口默认值
    enableSecSSLchange(e) {
      this.oParams.szSecSmtpPort = e ? "587" : "25";
    },
    
    async getEmailInfo () {
      let that = this;
      await that.getEmailCap();
      WebSDK.WSDK_GetDeviceConfig('emailCmd', null, {
        success: function (xmlDoc) {
          if (that.oCapbilities.bSptSnapShoot) {
            
            that.addReceiver();
          }
        },
        error: (error, xhr) => {
          xhr && Response.getState(xhr);
        }
      });
    },
    
    addReceiver() {
      let oParams = this.oParams;
      oParams.bShowReceiverDlg = true;
      oParams.szReceiverEditMode = "add";
      this.oReceiverDlgParams.iId = this.receiverList.length + 1;
      this.oReceiverDlgParams.szReceiverName = "";
      this.oReceiverDlgParams.szReceiverAddress = "";
      setTimeout(() => {//重新触发一下校验
        this.$refs['receiver_form'].resetValidates();
      });
    },
    // 删除选中的收件人
    deleteReceiver() {
      this.selectedReceiver.forEach((val1) => {
        this.receiverList.forEach((val2, index) => {
          if (val2.id === val1.id) {
            this.receiverList.splice(index, 1);
          }
        });
      });
      this.receiverList.forEach((val, index) => {
        val.id = index + 1;
      });
    },
    // 修改收件人
    modifyReceiver(oReceiver) {
      this.oParams.bShowReceiverDlg = true;
      this.oParams.szReceiverEditMode = "modify";
      this.oReceiverDlgParams.iId = oReceiver.id;
      this.oReceiverDlgParams.szReceiverName = oReceiver.name;
      this.oReceiverDlgParams.szReceiverAddress = oReceiver.emailAddress;
    },
    cancelReceiverDlg() {
      this.oParams.bShowReceiverDlg = false;
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
h3 {
  margin: 40px 0 0;
}
ul {
  list-style-type: none;
  padding: 0;
}
li {
  display: inline-block;
  margin: 0 10px;
}
a {
  color: #42b983;
}
</style>
